<template>
	<div class="padding-across-10" v-loading.fullscreen.lock="loading" element-loading-text="拼命加载中">
		<div style="width: 100%;display:inline;">
			<div style="float: left;padding-top: 2px">
				<span style="font-size: 14px;font-weight: bold;float: left;padding-right: 7px">查询类型</span>
				<el-checkbox-group v-model="checkList" style="width: 380px">
					<el-checkbox :label="1">条码重复</el-checkbox>
					<el-checkbox :label="2">标签重复</el-checkbox>
					<el-checkbox :label="3">标签为空</el-checkbox>
				</el-checkbox-group>
			</div>
			<span style="font-size: 14px;font-weight: bold">图书条码</span>
			<el-input style="width: 120px" size="small" v-model="barcode"></el-input>
			<span style="font-size: 14px;font-weight: bold">图书标签</span>
			<el-input style="width: 120px" size="small" v-model="tag"></el-input>
			<el-button id="searchData" type="primary" size="small" @click="getDatas"><i class="el-icon-search el-icon--left"></i>查询</el-button>
			<el-button type="primary" size="small" @click="refreshDatas"><i class="el-icon-eleg-icon_refresh el-icon--left"></i>刷新</el-button>
			<el-dropdown @command="handleCommand" style="margin-left: 10px">
				<el-button type="danger" size="small">
					标签重复删除<i class="el-icon-caret-bottom el-icon--right"></i>
				</el-button>
				<el-dropdown-menu slot="dropdown">
					<el-dropdown-item command="old">删除旧数据</el-dropdown-item>
					<el-dropdown-item command="new">删除新数据</el-dropdown-item>
					<el-dropdown-item command="hand">手动删除</el-dropdown-item>
				</el-dropdown-menu>
			</el-dropdown>
		</div>
		<el-table empty-text="暂无重复数据" border style="width: 100%;margin-top: 3px" @selection-change="handleSelectionChange" :data="tableData">
			<el-table-column :show-overflow-tooltip="true" type="selection" align="center" width="50px"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="序号" align="center" prop="keyid"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="书名" align="center" prop="name">
			</el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="条码" align="center" prop="barcode"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="标签" align="center" prop="tag"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="ISBN" align="center" prop="isbn"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="馆藏地" align="center">
				<template slot-scope="scope">
					<span v-if="scope.row.location != null">{{scope.row.location}}</span>
					<el-tag v-else type="danger">未绑定</el-tag>
				</template>
			</el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="状态" align="center">
				<template slot-scope="scope">
					<el-tag type="danger" v-if="scope.row.status === 1">丢失</el-tag>
					<el-tag type="warning" v-if="scope.row.status === 2">外借</el-tag>
					<el-tag type="success" v-if="scope.row.status === 3">在库</el-tag>
				</template>
			</el-table-column>
		</el-table>
		<div class="block" style="text-align:right;margin-bottom:100px;padding-top: 3px">
			<el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange" :current-page="currentPage" :page-size="pageSize" :page-sizes="[10,20,30,40,50]" layout="total,sizes, prev, pager, next, jumper" :total="totalSize">
			</el-pagination>
		</div>
	</div>
</template>
<script>
	import $ from 'jquery'
	import { GloabFun, HttpServer } from '../../../../../assets/js/common.js'
	import headerOpreate from '../../../../../components/headerOpreate'
	export default {
		components: {
			headerOpreate
		},
		data() {
			//回车触发查询按钮
			document.onkeydown = function(event) {
				var e = event || window.event;
				if(e && e.keyCode == 13) { //回车键的键值为13
					$("#searchData").click(); //调用登录按钮的登录事件
				}
			};
			return {
				loading: false,
				isReload: false,
				checkList: [1,2,3],
				barcode: '',
				tag: '',
				currentPage: 1,
				pageSize: 10,
				totalSize: 0,
				tableData: [],
				multipleSelection: []
			}
		},
		props: {
			templateObj: {
				type: Object,
				default: function() {
					return {};
				}
			}
		},
		methods: {
			executeAction(action) {
				if(action) {
					this[action]();
				}
			},
			handleSelectionChange(val) {
				this.multipleSelection = val;
			},
			handleCurrentChange(val) {
				this.currentPage = val;
				this.getDatas();
			},
			handleSizeChange(val) {
				this.pageSize = val;
				this.getDatas();
			},
			handleCommand(command) {
				if(command == 'old'){
					this.deleteOld();
				}else if(command == 'new'){
					this.deleteNew();
				}else {
					this.handleDelete();
				}
			},
			formateSelection() {
				var result = [],
				array = this.multipleSelection;
				for(var i = 0; i < array.length; i++) {
					result.push(array[i].keyid);
				}
				return result;
			},
			handleDelete() {
				if(this.formateSelection().length > 0) {
					this.$confirm('此操作将删除所选图书信息，是否继续?', '提示', {
						confirmButtonText: this.$t('message.yes'),
						cancelButtonText: this.$t('message.no'),
						type: 'warning'
					}).then(() => {
						HttpServer.httpPost.call(this, '/Api/Book/Delete', {keyid: this.formateSelection()}, function(response) {}, function(response) {
							if(response.data.code === 0) {
								this.$notify({
									title: '成功',
									message: this.$t('message.bulkDeleteSuccess'),
									type: 'success',
									duration: 2500
								});
							} else {
								this.$notify.error({
									title: '错误',
									message: response.data.msg,
									duration: 2500
								});
							}
							this.getDatas();
						});
					}).catch(() => {
						this.$notify.info({
							title: '消息',
							message: this.$t('message.operationCanceled'),
							duration: 2500
						})
					});
				} else {
					this.$notify({
						title: this.$t('message.warning'),
						message: this.$t('message.selectBulkDeleteWarning'),
						type: 'warning',
						duration: 2500
					});
				}
			},
			//删除旧数据，保留最新数据
			deleteOld() {
				this.$confirm('此操作将执行删除标签重复数据，并保留最新一条重复的图书信息，是否继续？', '提示', {
					confirmButtonText: this.$t('message.yes'),
					cancelButtonText: this.$t('message.no'),
					type: 'warning'
				}).then(() => {
					this.loading = true;
					HttpServer.httpPost.call(this, '/Api/Book/DeleteOldBadInfo', {}, function(response) {}, function(response) {
						this.loading = false;
						if(response.data.code === 0) {
							this.$notify({
								title: '成功',
								message: this.$t('message.deleteSuccess'),
								type: 'success',
								duration: 2500
							});
						} else {
							this.$notify.error({
								title: '错误',
								message: response.data.msg,
								duration: 2500
							});
						}
						this.getDatas();
					});
				}).catch(() => {
					this.$notify.info({
						title: '消息',
						message: this.$t('message.operationCanceled'),
						duration: 2500
					})
				});
			},
			//删除新数据，保留最旧数据
			deleteNew() {
				this.$confirm('此操作将执行删除标签重复数据，并保留最旧一条重复的图书信息，是否继续？', '提示', {
					confirmButtonText: this.$t('message.yes'),
					cancelButtonText: this.$t('message.no'),
					type: 'warning'
				}).then(() => {
					this.loading = true;
					HttpServer.httpPost.call(this, '/Api/Book/DeleteNewBadInfo', {}, function(response) {}, function(response) {
						this.loading = false;
						if(response.data.code === 0) {
							this.$notify({
								title: '成功',
								message: this.$t('message.deleteSuccess'),
								type: 'success',
								duration: 2500
							});
						} else {
							this.$notify.error({
								title: '错误',
								message: response.data.msg,
								duration: 2500
							});
						}
						this.getDatas();
					});
				}).catch(() => {
					this.$notify.info({
						title: '消息',
						message: this.$t('message.operationCanceled'),
						duration: 2500
					})
				});
			},
			refreshDatas() {
				this.isReload = true;
				this.getDatas();
			},
			getDatas() {
				this.loading = true;
				var param = {
					type: this.checkList, 
					qbookbar: this.barcode,
					qbooktag: this.tag,
					index: this.currentPage,
					pagesize: this.pageSize,
					UserId: parseInt(GloabFun.getKeyId())
				}
				HttpServer.httpPost.call(this, '/Api/Book/GetBadInfo', param, function(response){}, function(response){
					this.loading = false;
					if(response.data.code === 0){
						this.tableData = response.data.info;
						this.totalSize = response.data.totalcount;
						if(this.isReload){
							this.$notify({
								title: '成功',
								message: this.$t('message.refreshSuccess'),
								type: 'success',
								duration: 2500
							});
						}
					}else {
						this.$notify.error({
							title: '错误',
							message: response.data.msg,
							duration: 2500
						});
					}
					this.isReload = false;	
				})
			}
		},
		created() {
			this.getDatas();
		}
	}
</script>